Web Music Developer Meetup @札幌 #wmmu-jp 参加レポート

こんにちは！今回は、Web Music Developer Meetup @札幌 に参加してきたのでイベントの様子をご紹介いたします！

最後にはイベントの様子を収録した動画も載せておくので詳しくはそちらをご覧下さい。

イベント開催概要

2015年10月26日から30日まで札幌でW3Cの総会「TPAC 2015」が札幌コンベンションセンターで開催されています。
Audio WG（Web Audio APIとWeb MIDI APIの仕様を策定している Working Group）のメンバーも札幌に集まっているため、Audio WG のメンバーと日本の Web Music Developers との交流の場を作ろう！という目的で企画されたそうです。

弊社、クラスメソッド株式会社札幌オフィスのメンバーも運営お手伝いとして参加させていただきました。

会場

会場は札幌の「札幌市教育文化会館」です。この日札幌は初冠雪を記録し、イベント開始時も外は小雪が舞っていました。寒さも厳しかったですが、これも札幌開催らしくてよかったのではないでしょうか。

開会の挨拶

かわいりょうや 氏

かわいさんはヤマハ株式会社の方で、Web Music Developers JPの管理人でもあります。
今回のWeb Music Developer Meetupの開催に至った経緯の後にWeb Audio API、Web MIDI APIの概要を紹介されました。
資料中のリンクにアクセスすると、当日会場で行われたデモのアプリケーションを手元のブラウザでお試しいただけると思います。

縮まるWebアプリとネイティブアプリの距離

これまで、Web上のアプリケーションを利用するにはブラウザを開いて、さらにブックマークをクリックするといったステップが必要でしたが、Web App Manifestを使ってスマホのホームにアイコンを追加することで、ネイティブアプリを使う時と非常に近い体験をユーザーに届けることが可能になるということです。
Web App Manifest では、ホームにアイコンを追加した時の名前、アイコンや動作時の画面の向き、Splash等も制御可能です。

締めくくりには、Web Audio, Web MIDI の使い方がわからなくても「まずは触ってみよう！」という力強いメッセージをいただきました。紹介されたサンプルコードも数行から数十行のものなので手軽に試して遊べるなあ、といった印象を受けました。

MAKING THE WEB ROCK

Chris Wilson (Google Inc.)

Web Audio API, Web MIDI API を使ってできることをサンプルコードを交えて紹介してくれました。英語のセッションだったので、正直すべての内容をリアルタイムで理解することは難しかったのですが、そこは音楽のよいところで、それぞれの API でデモをしてくれたので Web Audio API, Web MIDI API を体感することができました。

デモアプリケーション

どれも Chris の Github で公開されているので是非遊んでみてください！きっと時間をわすれて遊んでしまいます。
ちなみに、下の画像の中でターンテーブルの画像があると思いますがこのアプリは Numark DJ2Go でコントロールしていて、市販のMIDIコントローラーでも簡単に接続してコントロールできるのがわかりました。

Web Audio API Creative Coding

藍 圭介 氏

藍さんはアナログシンセの moog を2Dで再現されたのちに、 three.js を使った3Dの moog の開発などの創作活動をされています。
今回は Web Audio API を用いた創作がひろがってきているという状況をユーザー目線からお話してくれました。

次の画像は Web Audio と加速度センサーを組み合わせたデモの様子です。iPhone を振るとあの音がブンブンなる感じです。そして、あの映画のエンドロールのようにこのアプリのコードが流れていました。

このほかにも、iPhone の裏に乾電池をセロハンテープで貼り付けてワウペダルを再現したものも紹介されて、会場の笑いを誘っていました。（笑っていたので写真を撮り損ねました。。）

Chrome Web MIDI 2015

豊島 隆志 氏 (Google Japan Inc.)

Chrome のデベロッパーで実際に Web MIDI の実装をされている方です。Web MIDI を使ってもらうにあたって、Web MIDI が現在どうなっているかといったことや、最近あった仕様の変更についての説明をしてくれました。

Web MIDI API は Chrome 43 から Ship されていて、配布されているそのままで使うことができるということです。これまでのようにchrome://flags で有効にする必要がなくなりました。

もっと多くの人に Web MIDI

まだまだ Web MIDI を使っている人が少ないということで、会場の参加者含め今後もっと多くの人に Web MIDI を使ってもらいたいというお話もされていました。

Music Notation and W3C: Framing the Future

Joe Berkovitz (Noteflight)

ブラウザで楽譜を書いたり編集したり公開、共有できるNoteflightを作っている方です。ご自身で作曲、楽器の演奏もするそうです。

Noteflight のデモで Music Notation を披露してくれました。その様子を見ると確かに簡単に書けそうだなといった印象です。デモで書いたスコアは２小節でしたが、それを再生するとスピーカーから誰もが知っているマリオサウンドが流れて、会場では拍手が巻き起こりました。

ライブパフォーマンスでの Web Audio, Web MIDI 活用事例

渡邊 正和 氏

Web Audio, Web MIDI を実際のライブの演出に活用されていて、これまでにもアーティストのかたとコラボレーションしてパフォーマンスをしてきたそうです。今回は渡邊さんの活動の中での Web Audio, Web MIDI 活用事例を紹介してくれました。

事例詳細記事

↓ドラマー Takashi Mori さんとのコラボレーション
Takashi Mori x Masakazu Watanabe|サスカッチblog

↓こども向けワークショップ
エレクトロボイスとビジュアルアート|サスカッチblog

ブラウザでリサージュ波形が見れる！！

リサージュ・デモ

ブラウザで上記URLにアクセスして、マイクの使用許可をするだけで音声に反応してリサージュ波形が描画されます。これがとにかく俊敏に動いてイベントの後帰宅してから１時間以上これにいろんな曲や音を聞かせて遊んでしまいました。
ちなみに、Android の Chrome でもやってみましたが同じように動作しました。ポケットにリサージュ。興奮しますね！

懇親会

懇親会では参加者にピザが振舞われました。

LT

懇親会のなかでLTが行なわれました。LTでは会場が一体になった参加型のデモがあったり、キーレスエントリーのリモコンのボタンを押した時の電波を受け取ってスペクトラムを表示するデモがあったりバラエティ豊かな盛りだくさんの内容でした。
LTの様子はこの後に載せている動画にも収録されているので是非ご覧ください。

配信動画

Web Music Developers Meetup @ Sapporo | YouTube

おわりに

Web Audio, Web MIDI について本当に多くのことを勉強させていただきました。Web Audio API, Web MIDI API を利用することで非常に簡単にブラウザで音を鳴らすことができますし、アプリケーションを作れば素早く公開することが可能です。さらに、音を視覚化するというお話もあってより直感的に音楽に触れることができると感じました。

懇親会で参加者の方々とお話させていただいたなかで、もっと子供たちに触れてもらいたいというお話がありましたが、学校の授業ではそれぞれの科目が独立しているので、「音楽」と「映像」や「音楽」と「プログラミング」といった感じで「音楽」と何かを組み合わせた形で体験してもらうと子供たちも関心を示してくれるのではないかと思いました。こういったところで、Web Audio, Web MIDI は活躍するのではないでしょうか。

それではみなさん楽しい Web Music Life を！